<template>
	<view>
		<view class="img">
			<image :src="'http://localhost:3000'+list.img" mode=""></image>
		</view>
		<view class="create">
			<view class="create1">
				<view class="jg">
					<text>￥{{list.price}}</text>
					<text>￥{{list.market_price}}</text>
				</view>
				<view class="sc">
					<view class="icon">
						<u-icon name="star" color="red"></u-icon>
					</view>
					<view class="">
						收藏
					</view>
				</view>
			</view>
			<view class="name">
				{{list.goodsname}}
			</view>
			<view class="name2">
				敏感肌可用，控油祛痘、男女可用、泡沫绵密、净透毛孔
			</view>
			<view class="xs">
				11.11限时299元起
			</view>
			<view class="js">
				<text>此商品于2020-11-11,00点结束闪购特卖，品牌美妆闪购专场
				</text>
				<text>查看></text>
			</view>
		</view>
		<view class="bottom">

			<view class="left">
				<view class="">
					<image src="../../static/image/hotline.png" mode=""></image>
					<view class="">
						客服
					</view>
				</view>
				<view class="">
					<image src="../../static/image/store.png" mode=""></image>
					<view class="">
						店铺
					</view>
				</view>
				<view class="">
					<image src="../../static/image/shoppingcart.png" mode=""></image>
					<view class="">
						购物车
					</view>
				</view>
			</view>
			<view class="right">
				<view class="botton1" @click="jia">加入购物车</view>
				<view class="botton2">立即购买</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getgoodSinfo,
		carTadd
	} from '../../request/app.js'
	export default {
		data() {
			return {
				list: []
			}
		},
		methods: {
			async getgoodSinfos(i) {
				let res = await getgoodSinfo({
					id: i
				})

				if (res.data.code == 200) {
					this.list = res.data.list[0]
				}
				console.log(this.list, '111111111list11111111');
			},
			jia() {

				let uid = uni.getStorageSync('userinfo').uid
				console.log(uni.getStorageSync('userinfo'), '0000000000');
				console.log(this.list, '22222222222');
				carTadd({
					uid: uid,
					goodsid: this.list.id,
					num: 1
				}).then(res => {
					console.log(res, '111111111111111111111111');
					if (res.data.code == 200) {
						uni.reLaunch({
							url: '../cart/cart?'
						})
					} else {
						uni.clearStorageSync('userinfo')

						uni.showModal({
							title: '提示',
							content: '请登录账号',
							success(res) {
								if (res.confirm) {
									uni.reLaunch({
										url: '../mine/mine'
									})
								}
							}
						})
					}
				})





			}
		},
		onLoad(options) {
			console.log(options.id, '11111111111111111111');
			this.getgoodSinfos(options.id)
		}
	}
</script>

<style>
	.left,
	.right {
		width: 50%;
		display: flex;
		justify-content: space-around;
	}

	.img image {
		width: 100%;
		height: 800rpx;
	}

	.create1 {
		display: flex;
		justify-content: space-between;
	}

	.create {
		margin-top: 30rpx;
	}

	.create1 .sc {
		color: red;
	}

	.create1 .sc .icon {
		margin-left: 20rpx;
	}

	.create1 .jg text:nth-child(1) {
		font-size: 40rpx;
		color: red;
	}

	.create1 .jg text:nth-child(2) {

		color: #ccc;
	}

	.name {
		font-size: 40rpx;
		color: #333333;
		margin-top: 30rpx;

		font-weight: bolder;
	}

	.name2 {
		font-size: 35rpx;
		color: #999999;
		margin-top: 30rpx;

	}

	.xs {
		background: #FF8066;
		width: 220rpx;
		height: 30rpx;
		font-size: 25rpx;
		color: #FFFFFF;
		line-height: 30rpx;
		margin-top: 30rpx;
		text-align: center;
	}

	.js {
		font-size: 25rpx;
		color: #999999;
		margin-top: 20rpx;
		line-height: 40rpx;
		display: flex;
		justify-content: space-between;
		background: #ccc;
		height: 40rpx;

	}

	.js text:nth-child(2) {
		color: #FF8066;
	}

	.bottom image {
		width: 50rpx;
		height: 50rpx;
	}

	.bottom {
		width: 100%;
		display: flex;
		justify-content: space-around;
		position: fixed;
		bottom: 0;
		background-color: white;
	}

	.botton1 {
		width: 150rpx;
		height: 80rpx;
		background-color: red;
		color: white;
		line-height: 80rpx;
		text-align: center;
		border-radius: 50rpx;
	}

	.botton2 {
		width: 150rpx;
		height: 80rpx;
		background-color: orange;
		color: white;
		line-height: 80rpx;
		text-align: center;
		border-radius: 50rpx;
	}
</style>
